<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>

<title>My JSP 'appointDt.jsp' starting page</title>

<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->
<script type="text/javascript"
	src="${pageContext.request.contextPath }/static/js/jquery-2.1.3.min.js"></script>
<script type="text/javascript">
	$(function(){
		$("button").click(function(){
			var book_id = $(this).parent().prev().prev().text();
			$.ajax({
				type : "POST",
				url : "${pageContext.request.contextPath}/appointmentController/cancleAppoint.do",
				data : {
					"book_id" : book_id
				},
				async : false,
				cache : false,
				success : function(data) {
					if (data == "default") {
						alert("取消预约失败");
					} else {
						alert("取消预约成功");
						window.location.reload();
					}

				},
				error : function() {
					alert("系统错误");
				}
			});
		});
	});
</script>
<style type="text/css">
table {
	height: 50px;
	width: 800px;
	border: 1px solid red;
	font-size: 14px;
	text-align: center;
}

tr,td {
	border: 1px solid red;
}
</style>
</head>
<body>
	<a href=${pageContext.request.contextPath}/bookController/showBook.do>返回</a>
	</br></br></br>
	<table>
		<tr>
			<td style="width: 10px;">book_id</td>
			<td style="width: 100px;">预订日期</td>
		</tr>
		<c:forEach var="item" items="${appointList}">
			<tr>
				<td id="${item.book_id }" style="width: 10px;">${item.book_id }</td>
				<td id="${item.appoint_time }" style="width: 100px;">${item.appoint_time }</td>
				<td style="width: 10px;"><button>取消预约</button></td>
			</tr>
		</c:forEach>
	</table>
</body>
</html>
